<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <link rel="stylesheet" href="/webjars/bootstrap/3.3.7/css/bootstrap.css">
  <script type="text/javascript" src="/webjars/jquery/3.4.1/jquery.js"></script>
  <script type="text/javascript" src="/webjars/axios/0.19.0/dist/axios.js"></script>
  <script type="text/javascript" src="/webjars/vue/2.6.10/dist/vue.js"></script>
</head>
<body>
  <div id="vuebox">
     <h1 style="margin-bottom: 12px" class="container">商务会员管理系统</h1>
    <div class="container">
    <div class="row">
      <div class="col-lg-3">
        <label>用户名:</label>
        <span th:text="${user.name}"></span>
      </div>
      <div class="col-lg-3">
        <label>用户类型:</label>
        <span th:if="${user.tyepd==1}" >普通会员</span>
        <span th:if="${user.tyepd==2}" >超级会员</span>
      </div>
      <div class="col-lg-3">
        <button type="button" class="btn btn-default" @click="tuichu">退出</button>
      </div>
    </div>
    <div class="row">
      <div class="col-lg-3">
        <a href="#" @click.stop="upmima">修改密码</a><br/>
        <a href="#" th:if="${user.tyepd==2}" @click.stop="selehuiyuan">查看所有会员</a>
      </div>
      <div class="col-lg-9" style="border: orchid 1px solid" id="xianshi">
       <h6 style="margin: auto 0px">欢迎使用商务会员管理系统</h6>
      </div>
    </div>
    </div>
  </div>
</body>
</html>
<script type="text/javascript">
        var vm=new Vue({
            el:"#vuebox",
            data:{

            },
            methods:{
                tuichu:function () {
                    var result=confirm("确认退出么!");
                    if(result){
                        window.location.href="/tuichu";
                    }
                },
                selehuiyuan:function () {
                    $("#xianshi").html("")
                    $("#xianshi").html('<object type="text/x-scriptlet" style="margin-left: 100px" width="600px" height="500px" data="seleuser.html"></object>')
                },
                upmima:function () {
                    $("#xianshi").html("")
                    $("#xianshi").html('<object type="text/x-scriptlet" style="margin-left: 100px" width="600px" height="500px" data="upusers.html"></object>')
                }
            }
    })
</script>